---
slug: ../DateRangePicker
---

import Basic from "../../_samples/main/DateRangePicker/Basic/Basic.md";
import MinMax from "../../_samples/main/DateRangePicker/MinMax/MinMax.md";
import DateFormat from "../../_samples/main/DateRangePicker/DateFormat/DateFormat.md";
import CustomFormatting from "../../_samples/main/DateRangePicker/CustomFormatting/CustomFormatting.md";

<%COMPONENT_OVERVIEW%>

## Basic Sample
<Basic />

<%COMPONENT_METADATA%>

## More Samples

### Date Formats

<DateFormat />

### Min and Max Dates
Define min and max date boundaries to contrain user choice.

<MinMax />

### CustomFormatting
You can have custom formatting for the display value and the value property.
Supported format options are pattern-based on Unicode LDML Date Format notation.
For more information, see <a target="_blank" href="http://unicode.org/reports/tr35/#Date_Field_Symbol_Table">UTS #35: Unicode Locale Data Markup Language</a>.

<CustomFormatting />
